/**
 * @description 工具栏：查询组件
 * @author chenyan
 */

import React, { PropTypes, PureComponent } from 'react';
import { connect } from 'dva';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { Tabs, message } from 'antd';
import HeaderC from './header';
import BasicInfoC from './basicInfo/basicInfo';
import BondValuationChange from './bondValuationChange';
import BondArtificialTradesC from './bondArtificialTransactions';
import BasicEvent from './basicEvent';
import BasicGrade from './basicGrade';
import SamePublishe from './samePublishe';
import MyHold from './myHold';
import BondHistoricalTradesC from './bondHistoricalTrads';
import { isZiGuanEvir } from '../../../../utils/commonFunc';
import styles from './index.less';
import TabC from '../../../../comps/other/tabC';

const { TabPane } = Tabs;

@Form.create()
class BondDeviationDetail extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      bondID: '',
      activeKey: '1',
      exchangeCode: '',
      tradingCode: '',
      isZiGuan: false, // false-资管系统  true-maat系统
    };
  }

  componentDidMount() {
    const obj = isZiGuanEvir();
    if (obj) {
      // 资管平台 保存数据到sessionStorage
      this.setState({
        isZiGuan: obj['iv-user'] ? true : false,
      });
      if (obj['info']) {
        sessionStorage.setItem('bondInfo', decodeURIComponent(obj['info']).replace(/\\/g, ''));
        if (obj['type']) {
          //定位在第几个tab
          this.handleChangeTab(obj['type']);
        }
      }
    }
    let bondInfo = sessionStorage.getItem('bondInfo') ? JSON.parse(sessionStorage.getItem('bondInfo')) : '';
    if (bondInfo.type === undefined) {
      //不是从债券偏离度页面跳转，默认其他信息如下
      const tempInfo = {
        type: '中债',
        price: 20,
        degree: 3,
      };
      bondInfo = { ...bondInfo, ...tempInfo };
      sessionStorage.setItem('bondInfo', JSON.stringify(bondInfo));
    }
    if (!bondInfo) {
      message.warning('未获取到债券信息');
      this.props.dispatch({
        type: 'tabController/closeTab',
        payload: {
          newUrl: '/marketAnalysis/bondDeviationAnalysis',
        },
      });
      return;
    }

    this.setState({
      bondID: bondInfo.bondID,
      exchangeCode: bondInfo.exchangeCode ? bondInfo.exchangeCode : '',
      tradingCode: bondInfo.tradingCode ? bondInfo.tradingCode : '',
    });
  }

  UNSAFE_componentWillReceiveProps(newProps) {
    let obj = isZiGuanEvir();
    if (obj) {
      //资管平台 保存数据到sessionStorage
      if (obj['info']) {
        //第一次didmount处理之后 这里不再处理，后续更新bondID在处理
        if (!this.state.bondID || this.state.bondID == JSON.parse(decodeURIComponent(obj['info']).replace(/\\/g, '')).bondID) return;
        sessionStorage.setItem('bondInfo', decodeURIComponent(obj['info']).replace(/\\/g, ''));
        if (obj['type']) {
          //定位在第几个tab
          this.handleChangeTab(obj['type']);
        }
      }
    }
    const bondInfo = sessionStorage.getItem('bondInfo') ? JSON.parse(sessionStorage.getItem('bondInfo')) : '';
    if (bondInfo && bondInfo.bondID && bondInfo.bondID != this.state.bondID) {
      this.setState({
        bondID: bondInfo.bondID,
        exchangeCode: bondInfo.exchangeCode ? bondInfo.exchangeCode : '',
        tradingCode: bondInfo.tradingCode ? bondInfo.tradingCode : '',
      });
    }
  }

  // 页面销毁去缓存
  componentWillUnmount() {
    sessionStorage.setItem('bondInfo', '');
    const { dispatch } = this.props;
    dispatch({
      type: 'bondDeviationDetailM/setState',
      payload: {
        mainIncomObj: {}, // 主营业务表格
        mainIncomPie: [], // 主营业务饼图
        marketObj: {}, // 流通
        comFinancialData: {}, // 财务数据
        dateListCom: [], // 财务日期列表
        dateListMainIncom: [], // 主要收入日期列表
        activeKey: '1',
      },
    });
  }

  // tab切换时调用
  handleChangeTab = (key) => {
    this.props.dispatch({
      type: 'bondDeviationDetailM/setState',
      payload: {
        activeKey: key,
      },
    });
  };

  render() {
    const {
      bondDeviationDetailM: { activeKey },
    } = this.props;
    const { bondID, isZiGuan, exchangeCode, tradingCode } = this.state;
    console.log('activeKey', this.state.activeKey)
    return (
      <div className={styles.bondDeviationDetail}>
        <HeaderC bondID={bondID} exchangeCode={exchangeCode} tradingCode={tradingCode} />
        <Tabs activeKey={activeKey} onChange={this.handleChangeTab}>
          <TabPane tab='债券基础信息' key='1' forceRender={false}>
            <BasicInfoC bondID={bondID} exchangeCode={exchangeCode} tradingCode={tradingCode} />
          </TabPane>
          <TabPane tab='债券估值变动' key='2' forceRender={false}>
            <BondValuationChange bondID={bondID} />
          </TabPane>
          <TabPane tab='债券评级' key='3' forceRender={false}>
            <BasicGrade bondID={bondID} isZiGuan={isZiGuan} />
          </TabPane>
          <TabPane tab='债券事件' key='4' forceRender={false}>
            <BasicEvent bondID={bondID} />
          </TabPane>
          <TabPane tab='同一发行人债券信息' key='5' forceRender={false}>
            <SamePublishe bondID={bondID} />
          </TabPane>
          <TabPane tab='历史债券异常交易信息' key='6' forceRender={false}>
            <BondArtificialTradesC bondID={bondID} />
          </TabPane>
          <TabPane tab='债券历史交易信息' key='7' forceRender={false}>
            <BondHistoricalTradesC bondID={bondID} />
          </TabPane>
          <TabPane tab='我的持仓' key='8' forceRender={false}>
            <MyHold />
          </TabPane>
        </Tabs>
      </div>
    );
  }
}

export default connect(({ bondDeviationDetailM, tabController, userM: user, loading }) => ({
  bondDeviationDetailM,
  tabController,
  loading,
  user,
}))(BondDeviationDetail);
